<template>
  <div class="p-4 rounded-lg">
    <emptyView des="暂无记录" v-if="list.length === 0 && !cp_loading" />
    <van-pull-refresh v-else class="h-full" v-model="cp_refreshing" @refresh="onRefresh">
      <van-list
        v-model:loading="cp_loading"
        :finished="cp_finished"
        finished-text="没有更多了"
        @load="loadMoreData"
      >
        <customerListRow
          @click="onItemClick(item)"
          v-for="(item, index) in list"
          :key="index"
          :item="item"
          class="mb-4"
        />
      </van-list>
      <van-back-top />
    </van-pull-refresh>
  </div>
</template>

<script setup>
import { defineProps, computed, defineEmits } from "vue";
import { useRouter } from "vue-router";
import customerListRow from "./customerListRow.vue";
import emptyView from "@/components/emptyView.vue";

const router = useRouter();

const props = defineProps({
  list: {
    type: Array,
    default: () => [12],
  },
  loading: {
    type: Boolean,
    default: false,
  },
  refreshing: {
    type: Boolean,
    default: false,
  },
  finished: {
    type: Boolean,
    default: false,
  },

  loadMoreData: {
    type: Function,
    default: () => {},
  },

  onRefresh: {
    type: Function,
    default: () => {},
  },

  st: {
    type: String,
    default: "",
  },

  et: {
    type: String,
    default: "",
  },

  myTeam: {
    type: Boolean,
    default: false,
  },

  dptIds: {
    type: Array,
    default: () => [],
  },
});

const emits = defineEmits(["update:loading", "update:finished", "update:refreshing"]);

const cp_loading = computed({
  set(v) {
    emits("update:loading", v);
  },

  get() {
    return props.loading;
  },
});

const cp_refreshing = computed({
  set(v) {
    emits("update:refreshing", v);
  },

  get() {
    return props.refreshing;
  },
});

const cp_finished = computed({
  set(v) {
    emits("update:finished", v);
  },

  get() {
    return props.finished;
  },
});

function onItemClick(item) {
  let query = {
    companyId: item.companyId,
    customerId: item.id,
    name: item.name,
  };
  // if (props.st) {
  //   query.st = props.st;
  // }
  // if (props.et) {
  //   query.et = props.et;
  // }
  if (props.myTeam) {
    query.myTeam = props.myTeam;
  }
  if (props.dptIds) {
    query.dptIds = props.dptIds;
  }
  router.push({ path: "/customerDetail", query: query || {} });
}
</script>

<style lang="less" scoped></style>
